<!DOCTYPE html>
<html lang="en">

<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <script type="text/javascript" src="https://cdn.bootcss.com/socket.io/2.0.1/socket.io.js"></script>
</head>

<body>
    <form action="/upload" enctype="multipart/form-data" method="post">
        <input type="file" name="upload" multiple="multiple">
        <input type="submit" value="Upload file" />
        <p id="process"></p>
        <progress id="id" value="0" max="73735694">
        </progress>
    </form>
</body>

<script>
    var socket = io();
    //获取文件上传的进度
    socket.on('numbers', function (data) {
        console.log("文件上传进度" + data.size);
        //socket.emit('my other event', { my: 'data' });
        document.getElementById("process").innerHTML = data.size + "/" + data.total;
        document.getElementById("id").value = data.size;
    });
    socket.on('total', function (data) {
        console.log('文件总大小:' + data.total);
    })

</script>

</html>